<script setup lang="ts">
import { getQclRightData } from '@/api/Quancheng';
import alertOverviewPie from '@/components/ECharts/alertOverviewPie/index.vue';
import COMPONENT_TITLES from '@/constants/components/componentsTitle';

const waringStatisticsData = ref({} as any);
const emit = defineEmits(['postMessage']);
const thirdGeneralClick = (data: any) => {
  emit('postMessage', data?.data?.clickData, '预警概况');
};
onMounted(async () => {
  const { data } = await getQclRightData({ type: 'waringStatistics' });
  waringStatisticsData.value = data.waringStatistics;
});
</script>

<template>
  <div class="chart-box">
    <alertOverviewPie
      :title="COMPONENT_TITLES.ALERT_OVERVIEW"
      @third-general-click="thirdGeneralClick"
      :echarts-data="waringStatisticsData.echartsData"
    />
  </div>
</template>

<style scoped lang="scss">
.chart-box {
  width: 100%;
  height: 100%;
}
</style>
